﻿@using Think9.Models;
@{
    ViewBag.Title = "Add";
    Layout = "~/Areas/Shared/_LayuiForm.cshtml";
}

<form class="layui-form">
    <input style="display:none" id="frm" value="@ViewBag.frm">
    <div class="layui-form-item">
        <label class="layui-form-label">选择分类</label>
        <div class="layui-input-block">
            @Html.DropDownList("ReportSort", (IEnumerable<SelectListItem>)ViewBag.SortList, "==请选择统计表分类==", new Dictionary<string, object> { })
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">统计表编码</label>
        <div class="layui-input-block layui-col-space3">
            <div class="layui-col-xs8 layui-col-sm8 layui-col-md8">
                <input type="text" name="ReportId" id="ReportId" placeholder="统计表编码" autocomplete="off" class="layui-input" lay-verify="required|id" maxlength="30">
            </div>
            <div class="layui-col-xs4 layui-col-sm4 layui-col-md4">
                <select name="AutoType" id="AutoType" lay-filter="selectfilter">
                    <option value="">⇓自动生成编码</option>
                    <option value="英文">英文</option>
                    <option value="全拼">全拼</option>
                    <option value="首拼">首拼</option>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">统计表名称</label>
        <div class="layui-input-block">
            <input type="text" name="ReportName" id="ReportName" placeholder="统计表名称" autocomplete="off" class="layui-input" lay-verify="required" maxlength="30">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label required">选择列数</label>
        <div class="layui-input-block">
            <select id="ColNum" name="ColNum" lay-filter="ColNum" lay-verify='required'>
                @foreach (valueTextEntity item in ((IEnumerable<valueTextEntity>)ViewBag.ColNum))
                {
                    <option value="@item.Value">@item.Text</option>
                }
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"></label>
        <div class="layui-input-block">
            <table class="layui-table" id="tableId" lay-filter="tableFilter"> </table>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required"> 选择字体</label>
        <div class="layui-input-block">
            <select id="FontStyle" name="FontStyle" lay-verify='required'>
                @foreach (valueTextEntity item in ((IEnumerable<valueTextEntity>)ViewBag.FontStyle))
                {
                    <option value="@item.Value">@item.Text</option>
                }
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">备 注</label>
        <div class="layui-input-block">
            <textarea class="layui-textarea" id="ReportRemarks" name="ReportRemarks" placeholder='备注'></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"> </label>
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="add">新 建</button>
        </div>
    </div>
</form>
<script>
    layui.use(["table", "form", "exLayer", "exUtils"], function () {
        let form = layui.form;
        let layer = layui.layer;
        let exLayer = layui.exLayer;
        let exUtils = layui.exUtils;
        let table = layui.table;

        let $ = layui.$;

        form.render(); //

        form.verify({
            id: function (value, item) {
                if (!new RegExp("^[a-zA-Z]+[a-zA-Z0-9]+$").test(value)) {
                    return '编码由英文字符和数字组成，并以字母开头，不得包含中文、空格及其他字符';
                }
            }
        });

        form.verify({
            name: function (value, item) {
                if (!new RegExp("^[\u4e00-\u9fa5_a-zA-Z0-9]+$").test(value)) {
                    return '名称由汉字、数字、字母、下划线组成，不得包含其他字符';
                }
            }
        });

        let ThisTable = table.render({
            elem: "#tableId",
            url: "/SysStats/Report/GetColNumber?iCount=" + $("#ColNum").val(),
            page: false,
            cols: [[
                { field: "ColNum", title: "列", width: 100 },
                { field: "ColWidth", title: "列宽(cm)", templet: '#ColWidth', width: 120 }
            ]],
            done: function (res, curr, count) {
                console.log(res, curr, count);
            }
        });

        //选择行数
        form.on('select(ColNum)', function (data) {
            ThisTable.reload({
                url: "/SysStats/Report/GetColNumber?iCount=" + $("#ColNum").val()
            });
            return false;
        })

        form.on("submit(add)", function (data) {
            var _list = [];
            foreachGridTable(_list);
            exUtils.ajax("/SysStats/Report/AddReport", "post", { "list": _list, entity: data.field }, true).done(function (response) {
                exLayer.greenTickMsg(response.message, function () {
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(index);
                    $(window.parent.document).find('#btn_refresh').click();//刷新
                });
            }).fail(function (error) {
                console.log(error);
            });
            return false;
        });

        //自动生成编码
        form.on('select(selectfilter)', function (data) {
            var name = $("#ReportName").val().trim();
            var type = data.value;
            if (name == "") {
                layer.msg("请输入名称");
                return false;
            }
            exUtils.ajax("/SysBasic/AutoCode/GetCode", "post", { name: name, type: type }, true).done(function (response) {
                $("#ReportId").val(response.extra);
            }).fail(function (error) {
                console.log(error);
            });
            return false;
        });

        function foreachGridTable(_list) {
            var trList = $(".layui-table").find("tr");  //获取table下的所有tr
            for (var i = 0; i < trList.length; i++) {  //遍历所有的tr
                var tdArr = trList.eq(i).find("td"); //获取该tr下的所有td

                var _no = tdArr.eq(0).text();
                var _with = tdArr.eq(1).find('input').val();

                if (_no != '') {
                    var _row = {};
                    _row.ColNum = _no;
                    _row.ColWidth = _with;
                    _list.push(_row);
                }
            }
        }

        //消息提示
        $(document).on("mouseenter", "*[lay-tips]", function () {
            var remind = $(this).attr("lay-tips");
            var tips = $(this).data("offset") || 4;
            var color = $(this).data("color") || '#88858e';
            layer.tips(remind, this, {
                time: -1,
                tips: [tips, color],
                area: ['auto', 'auto'],
            });
        }).on("mouseleave", "*[lay-tips]", function () {
            layer.closeAll("tips");
        });
    });
</script>
<!-- 列宽 -->
<script type='text/html' id='ColWidth'>
    <input type="text" name="ColWidth" value="{{d.ColWidth}}" class="layui-input" maxlength="4" style="height:32px;" verify="required|number">
</script>